<template>
  <view class="account_detail">
    <view class="search_box">
      <AtSearchBar 
        v-model="keyword"
        placeholder="请输入手机号搜索"
        show-action
        @search="onSearch" >
        <view slot="action"><Button type="info" size="small" @click="onSearch()">搜索</Button></view>
      </AtSearchBar>
    </view>
    <view class="num_stat">共{{total}}位会员</view>
    <!-- <scroll-view 
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="getListData">
      <view class="item_box" v-for="item in listData" :key="item.uid">
        <view class="headimg" @click="gotoInfo(item)">
          <img :src="item.headimgurl" alt="" class="head_img">
        </view>
        <view class="item_line">
          <view class="line_left" @click="gotoInfo(item)">{{item.real_name}}</view>
          <view class="color_blue" @click="gotoInfo(item)">选择</view>
        </view>
        <view class="item_line color999" @click="gotoInfo(item)">{{item.mobile}}</view>
        <view class="item_line color999" @click="gotoInfo(item)">
          账户余额：<span class="ver_mid color_orange">{{item.balance}}</span>，
          账户积分：<span class="ver_mid color_orange">{{item.point}}</span>
        </view>
      </view>
    </scroll-view> -->
    <scroll-view
      scrollY="true"
      v-if="listData.length"
      @scrolltolower="lower">
      <view class="user_item" v-for="(item,index) in listData" :key="index" @tap="gotoInfo(item)">
        <image class="item_img" :src="item.headimgurl"></image>
        <view class="item_right">
          <view>{{item.real_name}}</view>
          <view>{{item.mobile}} </view>
          <view>
            账户余额：<text class="color_orange">{{item.balance}}</text>，
            账户积分：<text class="color_orange">{{item.point}}</text>
          </view>
          <view class="item_card">选择</view>
        </view>
      </view>
      <AtLoadMore style="height:30px;margin-top:-10px" noMoreText="没有更多了" :status="loadingStatus"/>
    </scroll-view>
  </view>
</template>

<script>
import Taro from '@tarojs/taro'
import "./selectClient.scss"
import UserAPI from '../../api/user'

export default {
  data(){
    return{
      keyword: "",
      listData: [],
      page: 1,
      total: 0,
      loading: false, //到底部加载
      finished: false, //没有更多
    }
  },
  mounted(){
    this.listData = [];
    this.init();
  },
  methods:{
    init(){
      this.getListData()
    },
    lower(e) { // 到底加载更多
      console.log(e)
      if(!this.showLoading){
        if(this.total != this.listData.length){
          this.showLoading = true;
          this.loadingStatus = 'loading'
          this.getListData();
        }
      }
    },
    async getListData(){
      var data = {
        app_id: Taro.getStorageSync('app_id'),
        page: this.page,
        mobile: this.keyword
      }
      if(this.phone != ""){
        data.mobile = this.phone
      }
      const res = await UserAPI.getUserList(data);
      if(res.code == 200){
        this.total = res.data.total_num;
        if(res.data.result){
          res.data.result.forEach(item => {
            this.listData.push(item)
          })
        }
        this.showLoading = false;
        this.page ++;
        if(this.total == this.listData.length){
          this.loadingStatus = 'noMore';
        }else{
          // if(this.firstIn){
          //   this.page = 2;
          //   this.getListData();
          // }
        }
        
      }
    },
    onSearch(){
      console.log('search')
      this.page = 1;
      this.listData = [];
      this.getListData();
    },
    gotoInfo(item){
      console.log(item);
      try {
        Taro.setStorageSync('userInfo', JSON.stringify(item))
      } catch (e) {
       console.log("error", e);
      }
      Taro.navigateTo({
        url: "/pages/getMoney/getMoney"
      })
    },
    gotoAccount(item){
      var data = {
        uid: item.uid,
        balance: item.balance,
        point: item.point,
        header_img: item.header_img,
        username: item.username,
        type: "1"
      }
      this.$router.push({path:'/vipAccount',query:{data:data}})
    }
  }
}
</script>